import React from 'react';

class MTooltip extends React.Component {
	constructor(props) {
		super(props);
		this.state = {
			defaultTooltip:['M-tooltip-inner'],
			placement: {
				defaultPosition:"M-tooltip-default",
				leftTop:"M-tooltip-leftTop",
				left:"M-tooltip-left",
				leftBottom:"M-tooltip-leftBottom",
				topLeft: "M-tooltip-topLeft",
				top: "M-tooltip-top",
				topRight: "M-tooltip-topRight",
				rightTop:"M-tooltip-rightTop",
				right:"M-tooltip-right",
				rightBottom:"M-tooltip-rightBottom",
				bottomLeft: "M-tooltip-bottomLeft",
				bottom: "M-tooltip-bottom",
				bottomRight: "M-tooltip-bottomRight",
			},
		};
		this._initTooltip();
	};
	_initTooltip(){
		this.props.placement?this.state.placement[this.props.placement] ? this.state.defaultTooltip.push(this.state.placement[this.props.placement]):this.state.defaultTooltip.push(this.state.placement["defaultPosition"]):this.state.defaultTooltip.push(this.state.placement["defaultPosition"]);
	};
	render() {
		return (
			<div className="M-tooltip">
				{this.props.children}
				<div className={this.state.defaultTooltip.join(" ")}>
					{this.props.title}
					<span className="M-tooltip-arrow"></span>
				</div>
			</div>
		);
	}
}
module.exports = MTooltip;